<template>
    <div class="carInfo-dialog">
        <ul class="cd-content">
            <li>
                <label for="">{{ $t('vehicle.position.imei') }}:</label>
                <span>{{ form.deviceCode }}</span>
            </li>
            <li>
                <label for="">{{ $t('vehicle.position.vehicleVinCode') }}:</label>
                <span>{{ form.vehicleVin }}</span>
            </li>
            <!-- 状态(1 断开 2 连接 3 未绑定) -->
            <li>
                <label for="">{{ $t('vehicle.position.state') }}:</label>
                <span>{{ form.state == 1 ? $t('vehicle.position.offline') : form.state == 2 ? $t('vehicle.position.online') : form.state == 3 ?
                        $t('vehicle.position.unbind') : '' }}</span>
            </li>
            <li>
                <label for="">{{ $t('vehicle.position.batteryPower') }}:</label>
                <span>{{ form.soc?form.soc:'--' }}</span>
            </li>
            <li>
                <label for="">{{ $t('vehicle.position.posTime') }}:</label>
                <span>{{ form.recvTime?parseTime(form.recvTime):'--' }}</span>
            </li>
            <li>
                <label for="">{{ $t('vehicle.position.speed') }}:</label>
                <span>{{ form.speed?form.speed.toFixed(2):0 }}</span>
            </li>
            <li>
                <label for="">{{ $t('vehicle.position.altitude') }}:</label>
                <span>{{ form.altitude?form.altitude.toFixed(2):0 }}</span>
            </li>
            <li>
                <label for="">{{ $t('vehicle.position.posWay') }}:</label>
                <span>{{ form.type == 1 ? $t('vehicle.position.basePost') : $t('vehicle.position.sPos') }}</span>
            </li>
            <li>
                <label for="">{{ $t('vehicle.position.VehicleLocation') }}:</label>
                <span>{{ form.address?form.address:'--' }}</span>
            </li>
        </ul>
        <div class="cd-footer footer">
            <router-link class='link-type link' :to="{path:'/vehicle/vehicle',query:{deviceCode:form.deviceCode}}">{{$t('vehicle.position.VehicleMgr')}}
            </router-link>
            <router-link class='link-type link' :to="{path:'/device/device',query:{deviceCode:form.deviceCode}}">{{$t('vehicle.position.DeviceMgr')}}
            </router-link>
            <!-- <router-link class='link-type link' :to="{path:'/memberMgr',query:{row:form}}">{{$t('vehicle.position.MemberMgr')}}</router-link> -->
        </div>
    </div>
</template>

<script>
// import { getVehicleInfo } from '@/api/vehicleMonitor/vehicleRealInfo';
export default {
    filters: {
        numFilter(value) {
            let realVal = ''
            if (!isNaN(value) && value !== '') {
                // 截取当前数据到小数点后两位
                realVal = parseFloat(value).toFixed(2)
            }
            return realVal;
        }
    },
    props: {
        form: {
            type: Object,
            default: {}
        }

    },
    data() {
        return {}
    },
    methods: {
    }
}
</script>

<style lang="scss" scoped>
.carInfo-dialog{
    width: 250px!important;
}
.cd-header,
.cd-footer {
    display: flex;
    justify-content: flex-end;
}
.footer {
    .link + .link {
        margin-left: 10px;
    }
}
.cd-content {
    font-size: 14px;
    padding-left: 0;
    li {
        margin-bottom: 8px;
        display: flex;
        label {
            min-width: 85px;
            text-align: right;
            color: #666666;
            margin-right: 10px;
        }
        span {
            flex: 1;
        }
    }
}
</style>
